<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
	<title>用户信息浏览</title>
	<!--增加easyui组件的引入，否则rowIsNull函数一直报undefiend错误
	<script src="/static/easyui/jeasyui-extensions/jeasyui.extensions.ty.js" type="text/javascript"></script>-->
    <script src="static/easyui/jeasyui-extensions/jeasyui.extensions.ty.js" type="text/javascript"></script>
	<link rel="stylesheet" type="text/css" href="static/easyui/jquery-easyui-theme/default/easyui.css">
	<link rel="stylesheet" type="text/css" href="static/easyui/jquery-easyui-theme/icon.css">
	<link rel="stylesheet" type="text/css" href="static/easyui/icons/icon-all.css">	
	<script type="text/javascript" src="static/easyui/jquery/jquery-1.11.1.min.js"></script>
	<script type="text/javascript" src="static/easyui/jquery-easyui-1.3.6/jquery.easyui.min.js"></script>
  </head>
  <body style="font-family: '微软雅黑';margin:15px 10px;height: 97%"  class="easyui-layout">
  <div data-options="region:'north',title:'操作',split:true" style="height:80px;padding:5px 0;">
    <div style="padding-top: 10px">
        <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="add();">添加</a>
        <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="del()">删除</a>
        <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-edit" plain="true" onclick="upd()">修改</a>
        <a href="javascript:void(0)" class="easyui-linkbutton search" plain="true" iconCls="icon-search" onclick="javascript:$('#showDialog').dialog('open')">查询</a>
    </div>
</div>
<div data-options="region:'center',title:'用户查询结果'" style="padding:5px;background:#eee;">
    <table id="dg"></table>
    <div id="dlg"></div>
    <table id="totalTb"></table>
</div>

<div id="showDialog" class="easyui-dialog" title="用户查询" style="width:400px;height:200px;padding:10px"
     toolbar="#dlg-toolbar" buttons="#dlg-buttons" closed="true">
    <form id="searchFrom">
        <table>
            <tr>
                <td>
                    用户名：
                </td>
                <td>
                    <input type="text" id="username" name="username" class="easyui-validatebox"
                           data-options="width:150"/>
                </td>
            </tr>
            <tr>
                <td>
                    描述信息：
                </td>
                <td>
                    <input type="text" id="description" name="description" class="easyui-validatebox"
                           data-options="width:150"/>
                </td>
            </tr>
        </table>
        <div id="dlg-buttons">
            <table cellpadding="0" cellspacing="0" style="width:100%">
                <tr>
                    <td style="text-align:right">
                        <a id="query" href="#" class="easyui-linkbutton query" iconCls="icon-search" onclick="cx()">查询</a>
                        <a href="#" class="easyui-linkbutton" iconCls="icon-cancel" onclick="javascript:$('#showDialog').dialog('close')">取消</a>
                    </td>
                </tr>
            </table>
        </div>
    </form>
</div>
<script type="text/javascript">
    var dg;
    $(function () {
        dg = $('#dg').datagrid({
            method: 'post',
            url: '/basketballManage/user/json',
            fit: true,
            fitColumns: true,
            border: false,
            loadMsg:'数据加载中，请稍等！',
            striped: true,
            idField: 'id',
            singleSelect:true,
            collapsible:true,
            pagination: true,
            rownumbers: true,
            pageNumber: 1,
            pageSize: 5,
            pageList: [5, 10, 20, 30, 40],
            singleSelect: true,
            autoRowHeight: true,
            columns: [[
                {field: 'id', title: 'id'},
                {field: 'username', title: '用户名', sortable: true, width: 100,},
                {field: 'password', title: '密码', sortable: true, width: 200},
                {field: 'description', title: '描述', sortable: true, width: 300}
            ]],
            toolbar: '#toolbar'
        });
        $($('#dg').datagrid('getPager')).pagination({
                beforePageText: '第',//页数文本框前显示的汉字  
                afterPageText: '页    共 {pages} 页',
                displayMsg: '当前显示 {from} - {to} 条记录   共 {total} 条记录',
     });
    });
    



    //弹窗增加
    function add() {
        d = $("#dlg").dialog({
            title: '添加管理员',
            width: 380,
            height: 250,
            href: 'http://localhost:8080/basketballManage/user/create',
            maximizable: true,
            modal: true,
            buttons: [{
                text: '确认',
                handler: function () {
                    $("#mainform").submit();
                }
            }, {
                text: '取消',
                handler: function () {
                    d.panel('close');
                }
            }]
        });
    }



    //删除
    function del() {
        var row = dg.datagrid('getSelected');
        alert(row.id);
        if (rowIsNull(row)) return;
        parent.$.messager.confirm('提示', '删除后无法恢复您确定要删除？', function (data) {
            if (data) {
                $.ajax({
                    type: 'get',
                    url: "http://localhost:8080/basketballManage/user/delete/" + row.id,                   
                    success: function (data) {
                    //alert(data);
                     parent.$.messager.show({ title : "提示",msg: "删除成功！", position: "bottomRight" });
                     dg.datagrid("reload");
                        

                    }
                });
            }
        });
    }
    
    //弹窗修改
    function upd() {
        var row = dg.datagrid('getSelected');
        if (rowIsNull(row)) return;
        d = $("#dlg").dialog({
            title: '编辑管理员',
            width: 380,
            height: 250,
            href: 'http://localhost:8080/basketballManage/user/update/' + row.id,
            maximizable: true,
            modal: true,
            buttons: [{
                text: '修改',
                handler: function () {
                    $('#mainform').submit();
                }
            }, {
                text: '取消',
                handler: function () {
                    d.panel('close');
                }
            }]
        });
    }

    //创建查询对象并查询
    function cx() {
        //var obj = $("#searchFrom").serializeObject();
        dg.datagrid('reload', {
            "username":$("#username").val(),
            "description": $("#description").val()
        });
        $('#showDialog').dialog('close');
        $("#username").val("");
        $("#description").val("");
    }

</script>  
  </body>
</html>
